<template>
  <ElementDialog
    width="300px"
    class="SelectPrintLabelSpecs"
    embed
    :visible="visible"
    title="打印标签规格"
    @update:visible="val => $emit('update:visible', val)">
    <div>
      <FyRadio v-model="specsValue" :dic="radioData" style="font-size: 24px; line-height: 30px" />
    </div>
    <template #footer>
      <ElButton type="primary" @click="confirm">确定</ElButton>
    </template>
  </ElementDialog>
</template>

<script>
  import { getDictData } from '@/util/dictionary'

  export default {
    name: 'SelectPrintLabelSpecs',
    props: {
      visible: {
        type: Boolean,
        default: false
      }
    },
    data() {
      return {
        specsValue: '1',
        radioData: []
      }
    },
    async created() {
      this.radioData = await getDictData('LabelSpecs')
    },
    methods: {
      confirm() {
        this.$emit('confirm', this.specsValue)
      }
    }
  }
</script>

<style lang="scss">
  .SelectPrintLabelSpecs {
    .el-radio {
      width: 100%;
      margin-right: 30px;
      color: #606266;
      font-weight: 500;
      line-height: 40px !important;
      cursor: pointer;
    }

    .el-radio__label {
      padding-left: 10px;
      font-size: 24px !important;
    }
  }
</style>
